import type {Directive} from "vue";
import {userStore} from "@/store/user";

//自定义按钮权限指令，第一种方式，注销不用
export const perm:Directive={
    mounted(el,binding){
        const store = userStore()
        //按钮上的权限字段
        const {value} = binding
        //当前用户拥有的权限字段
        const perm = store.getCodeLIst
        if(value && value instanceof Array && value.length>0){
            const permissionRoles = value
            //判断按钮权限是否存在用户权限里面
            const hasPremission = perm.some((role)=>{
                return permissionRoles.includes(role)
            })
            //如果没有权限，就隐藏
            if(!hasPremission){
                el.style.display = 'none'
            }
        }else{
            throw new Error('按钮权限的传递方式v-perm=[sys:role:add]')
        }
    }
}
//使用方法，main，ts里面引入
// import {perm} from "@/directive/perm";
// app.directive('prem',perm)
//实际应用
//<el-button v-perm="['sys:user:edit']" icon="Edit" size="default" type="primary" @click="editBtn(scope.row)">编辑</el-button>
